import React, {Component} from 'react';
import {Image, ImageBackground, StyleSheet, Text, View} from 'react-native';
import {Flex, WingBlank} from '@ant-design/react-native';

class FootPrint extends Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <Flex style={styles.flex}>
                <Flex style={{width: '25%'}}>
                    <ImageBackground
                        style={{width: '100%', height: undefined, margin: 10, aspectRatio: 1 / 1}}
                        source={require('~/assets/community/background.png')}>
                        <Flex style={{height: '100%', width: '100%'}} justify={'center'} align={'center'}>
                            <Text style={{color: 'white', fontSize: 16, width: '100%', textAlign: 'center'}}> {this.props.item.ParkingName}</Text>
                        </Flex>
                    </ImageBackground>
                </Flex>
                <Flex style={styles.itemtextview}>
                    <Flex style={styles.item} justify={'between'} align={'center'}>
                        <Text style={styles.lowername}>{this.props.item.BuildingName}</Text>
                        <Text style={styles.biaoqian}>出售</Text>
                    </Flex>
                    <Flex style={styles.item}>
                        <Text style={styles.text}>{this.props.item.AreaName}</Text>
                        <Text style={styles.text}>{this.props.item.ParkingName}</Text>
                    </Flex>
                    <Flex style={styles.item}>
                        <Text numberOfLines={1} style={{fontSize: 12, color: '#666666', marginTop: 9, width: '90%'}}>
                            <Image
                                style={{
                                    width: 12,
                                    height: 12,
                                }}
                                source={require('~/assets/shouye/dizhi.png')}
                            />
                            {this.props.item.Address}
                        </Text>
                    </Flex>
                    <Flex style={styles.item}>
                        <Text style={styles.money}>
                            价格:
                            <Text
                                style={{
                                    fontSize: 18,
                                    fontWeight: 'bold',
                                }}>
                                {this.props.item.PriceSell}
                            </Text>
                            元
                            原价：{this.props.item.PriceMarket}元
                        </Text>
                    </Flex>
                </Flex>
            </Flex>
        );
    }
}

export default FootPrint;

const styles = StyleSheet.create({
    scrollview: {
        flex: 1,
    },
    flex: {
        width: '100%',
        backgroundColor: 'white',
        height: 125,
        marginTop: 10,
        borderRadius: 5,
    },
    list: {
        width: '100%',
        flexDirection: 'column',
    },
    item: {
        width: '90%',
    },
    lowername: {
        fontSize: 15,
        color: '#333333',
        fontWeight: 'bold',
    },
    itemtextview: {
        width: '75%',
        flexDirection: 'column',
        paddingLeft: 10,
    },

    text: {
        fontSize: 12,
        color: '#666666',
        marginTop: 9,
    },
    biaoqian: {
        width: 40,
        height: 20,
        fontSize: 10,
        borderRadius: 2,
        textAlign: 'center',
        paddingTop: 2,
        backgroundColor: '#EB5A31',
        color: '#FFFFFF',
    },
    money: {
        fontSize: 14,
        color: '#EB5A31',
    },
    tjtext: {
        fontSize: 8,
    },
});
